<template>
  <!-- 首页 -->
  <div id="index-box">
    <!-- <div id="header"></div> -->
    <div id="index-left">
      <div id="left-head"></div>
      <el-menu
        :collapse="true"
        style="min-height: 630px; border: none"
        default-active="2"
        class="el-menu-vertical-demo"
        @open="handleOpen"
        @close="handleClose"
        background-color="#606060"
        text-color="#ffffff"
        active-text-color="#ffd04b"
      >
        <el-submenu index="1">
          <template slot="title">
            <i class="el-icon-shopping-cart-2"></i>
            购货
          </template>
          <el-menu-item-group title="采购单据">
            <el-menu-item index="1-1" @click="goto('PurchaseInquiry')"
              >购货询价</el-menu-item
            >
            <el-menu-item index="1-2" @click="goto('PriceComparison')"
              >购货比价</el-menu-item
            >
            <el-menu-item index="1-3" @click="goto('Order')"
              >购货订单</el-menu-item
            >
            <el-menu-item index="1-4" @click="goto('PurchaseOrder')"
              >购货单</el-menu-item
            >
            <el-menu-item index="1-5" @click="goto('PurReturnOrder')"
              >购货退货单</el-menu-item
            >
            <el-menu-item index="1-6" @click="goto('OrderWithPins')"
              >已销订购看板</el-menu-item
            >
            <el-menu-item index="1-7" @click="goto('Invoice')"
              >采购发票登记</el-menu-item
            >
            <el-menu-item index="1-8" @click="goto('History')"
              >采购历史价跟踪</el-menu-item
            >
          </el-menu-item-group>
          <el-menu-item-group title="采购报表">
            <el-menu-item index="1-9" @click="goto('OrderTrack')"
              >采购订单追踪表</el-menu-item
            >
            <el-menu-item index="1-10" @click="goto('Schedule')"
              >采购明细表</el-menu-item
            >
            <el-menu-item index="1-11" @click="goto('SumByCommodity')"
              >汇总表（按商品）</el-menu-item
            >
            <el-menu-item index="1-12" @click="goto('SumBySupplier')"
              >汇总表（按供应商）</el-menu-item
            >
            <el-menu-item index="1-13" @click="goto('SumByAgent')"
              >汇总表（按业务员）</el-menu-item
            >
            <el-menu-item index="1-14" @click="goto('PaymentSchedule')"
              >采购付款一览表</el-menu-item
            >
            <el-menu-item index="1-15" @click="goto('OrderChange')"
              >采购订单变更表</el-menu-item
            >
          </el-menu-item-group>
          <!-- <el-submenu index="1-4">
            <template slot="title">选项4</template>
            <el-menu-item index="1-4-1">选项1</el-menu-item>
          </el-submenu> -->
        </el-submenu>
        <el-submenu index="2">
          <template slot="title">
            <i class="el-icon-sold-out"></i>
            销货
          </template>
          <el-menu-item-group title="销售单据">
            <el-menu-item index="2-1" @click="goto('quote')"
              >报价单</el-menu-item
            >
            <el-menu-item index="2-2" @click="goto('SaleOrders')"
              >销货订单</el-menu-item
            >
            <el-menu-item index="2-3" @click="goto('SaleOrder')"
              >销货单</el-menu-item
            >
            <el-menu-item index="2-4" @click="goto('SellReturnOrder')"
              >销货退货单</el-menu-item
            >
            <el-menu-item index="2-5" @click="goto('Invoicing')"
              >销售发票登记</el-menu-item
            >
            <el-menu-item index="2-6" @click="goto('Logistics')"
              >物流服务</el-menu-item
            >
          </el-menu-item-group>
          <el-menu-item-group title="销售报表">
            <el-menu-item index="2-7" @click="goto('SalesOrderTracking')"
              >销售订单跟踪表</el-menu-item
            >
            <el-menu-item index="2-8" @click="goto('SaleStatement')"
              >销售明细表</el-menu-item
            >
            <el-menu-item index="2-9" @click="goto('OrderSummary_goods')"
              >销售汇总（按商品）</el-menu-item
            >
            <el-menu-item index="2-10" @click="goto('OrderSummary_client')"
              >销售汇总（按客户）</el-menu-item
            >
            <el-menu-item index="2-11" @click="goto('OrderSummary_saleman')"
              >销售汇总（按销售人员）</el-menu-item
            >
            <el-menu-item index="2-12" @click="goto('SalesReceipts')"
              >销售收款一览表</el-menu-item
            >
            <el-menu-item index="2-13" @click="goto('SellProfit')"
              >销售利润表</el-menu-item
            >
          </el-menu-item-group>
        </el-submenu>
        <el-submenu index="3">
          <template slot="title">
            <i class="el-icon-house"></i>
            仓库
          </template>
          <el-menu-item-group title="仓库单据">
            <el-menu-item index="3-1" @click="goto('ChangeList')"
              >调拨单</el-menu-item
            >
            <el-menu-item index="3-2" @click="goto('addInBound')"
              >入库单</el-menu-item
            >
            <el-menu-item index="3-3" @click="goto('addOutBound')"
              >出库单</el-menu-item
            >
            <el-menu-item index="3-4" @click="goto('addCostChange')"
              >成本调整单</el-menu-item
            >
            <el-menu-item index="3-5" @click="goto('addComboBill')"
              >组装单</el-menu-item
            >
            <el-menu-item index="3-6" @click="goto('addApartBill')"
              >拆卸单</el-menu-item
            >
            <!-- <el-menu-item index="3-7" @click="goto('addTemplate')">组装拆卸模版</el-menu-item> -->
          </el-menu-item-group>
          <el-menu-item-group title="仓库报表">
            <el-menu-item index="3-7" @click="goto('storeLeave')"
              >商品库存余额表</el-menu-item
            >
            <el-menu-item index="3-8" @click="goto('storeTransDetails')"
              >商品收发明细表</el-menu-item
            >
            <!-- <el-menu-item index="3-9">商品收发汇总表</el-menu-item> -->
            <el-menu-item index="3-9" @click="goto('inAndOutDetail')"
              >出入库明细表</el-menu-item
            >
            <el-menu-item index="3-10" @click="goto('serialNumberTable')"
              >序列号跟踪表</el-menu-item
            >
            <!-- <el-menu-item index="3-11">序列号状态表</el-menu-item> -->
            <el-menu-item index="3-11" @click="goto('batchExpirationTable')"
              >批次保质期清单</el-menu-item
            >
            <el-menu-item index="3-12" @click="goto('batchTable')"
              >批次跟踪表</el-menu-item
            >
          </el-menu-item-group>
          <el-menu-item-group title="盘点">
            <el-menu-item index="3-13" @click="goto('countStore')"
              >盘点</el-menu-item
            >
            <el-menu-item index="3-14" @click="goto('countResult')"
              >盘点记录</el-menu-item
            >
            <el-menu-item index="3-15" @click="goto('serialCount')"
              >序列号盘点</el-menu-item
            >
          </el-menu-item-group>
        </el-submenu>
        <el-submenu index="4">
          <template slot="title">
            <i class="el-icon-wallet"></i>
            资金
          </template>
          <el-menu-item-group title="资金单据">
            <el-menu-item index="4-1" @click="goto('Rceipt')"
              >收款表</el-menu-item
            >
            <el-menu-item index="4-2" @click="goto('Will')"
              >预收款单</el-menu-item
            >
            <el-menu-item index="4-3" @click="goto('Pay')">付款单</el-menu-item>
            <el-menu-item index="4-4" @click="goto('WriteOff')"
              >核销单</el-menu-item
            >
            <el-menu-item index="4-5" @click="goto('OtherIn')"
              >其他收入单</el-menu-item
            >
            <el-menu-item index="4-6" @click="goto('OtherOut')"
              >其他支出单</el-menu-item
            >

            <el-menu-item index="4-8" @click="goto('CashChange')"
              >资金转账单</el-menu-item
            >
          </el-menu-item-group>
          <el-menu-item-group title="资金报表">
            <el-menu-item index="4-10" @click="goto('BankCash')"
              >现金银行报表</el-menu-item
            >
            <el-menu-item index="4-11" @click="goto('PayDetails')"
              >应付款明细表</el-menu-item
            >
            <el-menu-item index="4-12" @click="goto('GetDetails')"
              >应收款明细表</el-menu-item
            >
            <el-menu-item index="4-13" @click="goto('PayAll')"
              >应付款汇总表</el-menu-item
            >
            <el-menu-item index="4-14" @click="goto('GetAll')"
              >应收款汇总表</el-menu-item
            >
            <el-menu-item index="4-15" @click="goto('CustomerCash')"
              >客户对账单</el-menu-item
            >
            <el-menu-item index="4-13" @click="goto('SupplierCash')"
              >供应商对账单</el-menu-item
            >
          </el-menu-item-group>
          <el-menu-item-group title="资金报表">
            <el-menu-item index="4-17" @click="goto('OtherCash')"
              >其他收支明细表</el-menu-item
            >
            <el-menu-item index="4-18" @click="goto('Profit')"
              >利润表</el-menu-item
            >
          </el-menu-item-group>
        </el-submenu>
        <el-submenu index="5">
          <template slot="title">
            <i class="el-icon-goods"></i>
            商品
          </template>
          <el-menu-item-group title="商品资料">
            <el-menu-item index="5-1" @click="goto('Goods')">商品</el-menu-item>
            <el-menu-item index="5-2" @click="goto('Unit')"
              >计量单位</el-menu-item
            >
            <el-menu-item index="5-3" @click="goto('GoodKinds')"
              >商品类别</el-menu-item
            >
            <el-menu-item index="5-4" @click="goto('SecondaryAttributes')"
              >辅助属性</el-menu-item
            >
            <el-menu-item index="5-6" @click="goto('WareHouse')"
              >商品货架</el-menu-item
            >
          </el-menu-item-group>
          <el-menu-item-group title="商品价格">
            <el-menu-item index="5-8" @click="goto('GoodPrice')"
              >商品价格本</el-menu-item
            >
          </el-menu-item-group>
        </el-submenu>
        <el-submenu index="6">
          <template slot="title">
            <i class="el-icon-folder"></i>
            资料
          </template>
          <el-menu-item-group title="基础资料">
            <el-menu-item index="6-1" @click="goto('Client')"
              >客户</el-menu-item
            >
            <el-menu-item index="6-2" @click="goto('Provider')"
              >供应商</el-menu-item
            >
            <el-menu-item index="6-3" @click="goto('StoreHome')"
              >仓库</el-menu-item
            >
            <el-menu-item index="6-4" @click="goto('Employee')"
              >职员</el-menu-item
            >
            <el-menu-item index="6-9" @click="goto('Roles')">角色</el-menu-item>
            <el-menu-item index="6-5" @click="goto('Account')"
              >账户</el-menu-item
            >
            <el-menu-item index="6-6" @click="goto('ClientLevel')"
              >客户等级</el-menu-item
            >
            <el-menu-item index="6-7" @click="goto('Area')">地区</el-menu-item>
            <el-menu-item index="6-8" @click="goto('Depart')"
              >部门</el-menu-item
            >
            <el-menu-item index="6-9" @click="goto('Address')"
              >发货地址</el-menu-item
            >
          </el-menu-item-group>
          <el-menu-item-group title="辅助资料">
            <el-menu-item index="6-10" @click="goto('CustomerType')"
              >客户类别</el-menu-item
            >
            <el-menu-item index="6-11" @click="goto('ProviderType')"
              >供应商类别</el-menu-item
            >
            <el-menu-item index="6-12" @click="goto('PayOther')"
              >支出类别</el-menu-item
            >
            <el-menu-item index="6-13" @click="goto('Get')"
              >收入类别</el-menu-item
            >
            <el-menu-item index="6-14" @click="goto('PayType')"
              >结算方式</el-menu-item
            >
            <el-menu-item index="6-15" @click="goto('Rules')"
              >单据编码规则</el-menu-item
            >
            <el-menu-item index="6-16" @click="goto('Road')">线路</el-menu-item>
          </el-menu-item-group>
        </el-submenu>
        <el-submenu index="7">
          <template slot="title">
            <i class="el-icon-folder"></i>
            日志
          </template>
          <el-menu-item-group title="基础资料">
            <el-menu-item index="7-1" @click="goto('Act')"
              >操作日志</el-menu-item
            >
            <el-menu-item index="7-2" @click="goto('LoginDate')"
              >登录日志</el-menu-item
            >
          </el-menu-item-group>
        </el-submenu>
        <el-submenu index="8">
          <template slot="title">
            <i class="el-icon-folder"></i>
            流程管理
          </template>
          <el-menu-item index="8-1" @click="goto('Deployment')"
            >流程部署</el-menu-item
          >
          <el-menu-item index="8-2" @click="goto('Model')"
            >流程模型</el-menu-item
          >
          <el-menu-item index="8-3" @click="goto('UpdateModel')"
            >编辑流程</el-menu-item
          >
        </el-submenu>
        <el-submenu index="9">
          <template slot="title">
            <i class="el-icon-folder"></i>
            个人管理
          </template>
          <el-menu-item index="9-1" @click="goto('taskList')"
            >代办任务</el-menu-item
          >
          <!-- <el-menu-item index="9-2" @click="goto('Model')">流程模型</el-menu-item>
          <el-menu-item index="9-3" @click="goto('UpdateModel')">编辑流程</el-menu-item> -->
        </el-submenu>
      </el-menu>
    </div>
    <div id="index-right">
      <div class="right-top">
        <Tabs />
      </div>
      <div class="right-content">
        <router-view></router-view>
      </div>
    </div>
  </div>
</template>
<script>
import Navigate from "@/components/information/Navigate.vue";
import Tabs from "./public_com/tabs.vue";
export default {
  name: "Index",
  components: {
    Navigate,
    Tabs,
  },
  methods: {
    handleOpen(key, keyPath) {
      console.log(key, keyPath);
    },
    handleClose(key, keyPath) {
      console.log(key, keyPath);
    },
    goto(to) {
      if (this.$route.path !== "/" + to) {
        this.$router.push(to);
      }
    },
  },
};
</script>

<style>
* {
  margin: 0;
  padding: 0;
}

a {
  text-decoration: none;
  color: #ffffff;
}

#index-box {
  width: calc(100%);
  height: 100%;
  margin: auto;
  /* border-radius: 20px; */
  overflow: hidden;
  background-color: #606060;
}

.el-submenu {
  width: 120px;
}

.el-menu--collapse > .el-submenu > .el-submenu__title [class^="el-icon-"] {
  color: #ffffff;
  font-size: 17px;
  position: relative;
  right: -5px;
}

#index-left {
  float: left;
  height: 100%;
}

.el-menu-item-group .el-menu-item {
  font-size: 13px;
  height: 45px;
  line-height: 45px;
}

.el-menu-item-group {
  float: left;
  padding-left: 40px;
  padding-right: 60px;
}

#left-head {
  width: 100px;
  height: 70px;
  background-image: url(../assets/image/logo.png);
  background-size: 140px;
  background-position-x: -10px;
  background-position-y: center;
  background-repeat: no-repeat;
}

#index-right {
  float: right;
  width: calc(100% - 120px);
  /* min-height: 700px; */
  height: 100%;
  border-radius: 15px;
  background-color: white;
  overflow: scroll;
}

.el-menu-item-group .el-menu-item-group__title {
  color: #2fbaff;
}

.right-top {
  width: 98%;
  height: 60px;
  /* background-color: gray; */
  /* border: 1px solid gray; */
}

.right-content {
  width: 98%;
  height: 600px;
  /* border: 1px solid gray; */
}

.right-top,
.right-content {
  margin: auto;
}
</style>